<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
    <link rel="stylesheet" type="text/css" href="css/flexpaper.css"/>

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/flexpaper.js"></script>
    <style type="text/css">
        html, body {
            font: 12px/1.5 '\5FAE\8F6F\96C5\9ED1', arial, serif;
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
        }

        .doc-viewer-container,
        #paper-viewer {
            width: 100%;
            height: 100%;
            position: relative;
            overflow: hidden;
        }

        .viewer-msg {
            position: absolute;
            left: 0;
            bottom: 0;
            width: 100%;
            height: 50px;
            line-height: 50px;
            color: #fff;
            font-size: 18px;
            overflow: hidden;
            text-align: center;
            display: none;
        }

        .viewer-msg .btn-close {
            cursor: pointer;
            position: absolute;
            top: 0;
            right: 40px;
            font-size: 36px;
        }

        iframe.viewer-msg {
            background: #fff;
            border: 0;
            z-index: 9;
        }

        div.viewer-msg {
            background: #000;
            filter: alpha(opacity=50);
            -moz-opacity: .5;
            opacity: .5;
            z-index: 10;
        }

        .fit {
            position: absolute;
            top: 0;
            height: 100%;
            width: 100%;
            filter: alpha(opacity=80);
            -moz-opacity: .8;
            opacity: .8;
            background: #b7bfc1;
            z-index: 9;
        }

        .fit p {
            position: absolute;
            top: 50%;
            width: 100%;
            margin-top: -20px;
            line-height: 20px;
            color: #fff;
            font-size: 18px;
            text-align: center;
        }

        .loading-msg {
            display: block;
        }

        .install,
        .fail {
            display: none;
        }

        .not-install .fit {
            background: #000;
        }

        .not-install .install a {
            color: #06a7e1;
        }

        .not-install .install,
        .load-fail .fail {
            display: block;
        }

        .not-install .loader,
        .load-fail .loader {
            display: none;
        }

        .loaded .fit {
            display: none;
        }
        .load-fail .fit,
        .not-install .fit {
            display: block;
        }
    </style>
</head>
<body>
<div class="doc-viewer-container">
    <div class="fit">
        <p class="loader">
            <img src="css/loading.gif">
            <span class="loading-msg">loading...</span>
        </p>

        <p class="install">
            您还没有安装Flash插件，无法进行查看， 请点击<a href="http://www.adobe.com/go/getflash" target="_blank">这里</a>安装
        </p>

        <p class="fail">资源加载失败, <span>请重新尝试</span></p>
    </div>
    <iframe class="viewer-msg" frameborder="0"></iframe>
    <div class="viewer-msg">目前最多可浏览10页，阅读更多，请下载..<span class="btn-close">&times;</span></div>
    <div id="paper-viewer" class="flexpaper_viewer"></div>
</div>
<script type="text/javascript">
    (function ($) {
        var $viewer = $('.doc-viewer-container'),
                $tips = $viewer.find('.viewer-msg'),
                get = function (name) {
                    var regex = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"),
                            r = window.location.search.substr(1).match(regex);
                    return r ? decodeURIComponent(r[2]) : null;
                },
                url = get('url'),
                swf = get('swf') || url,
                bookmarks = get('bookmarks'),
                split, config;

        // prepare
        (function () {
            try {
                var v = flashembed.getVersion();
                if (0 == v[0]) {
                    $viewer.addClass('not-install');
                }

                if ('file:' == location.protocol) {
                    $viewer.find('.fail').text('Flash无法通过本地协议加载文件，请在服务器上打开');
                    $viewer.addClass('load-fail');
                }
            } catch (ex) {
            }
        })();

        $tips.find('.btn-close').bind('click', function () {
            $tips.hide();
        });

        /*-
         * DOC: 会自动转换为相应的格式并传递 {format} (该参数需要 escape, eg: { DOC: escape(url) }
         * SWFFile:
         * 传递的 url 中 {} 中内容会被解析 [*,padding],totalPages 被解析为页码和总页数
         * eg: {pager[*,0].swf,100} 则会分页请求 pager1.swf,pager2.swf,...
         * padding:
         *  0: 不需要填充
         *  1: 使用一个0填充
         * ------
         * 关于翻页可以通过 page hash 进行初始化翻页, eg: #page=2
         */
        // url = '{'+ url + 'format={format}&page=[*,0],{totalPages}' + '}';

        // split mode: doc-%-total
        split = swf.match(/[^/]+-([1-9][0-9]*)-%/);
        if (split) {
            swf = '{' + swf.replace('%', '[*,0]') + ',' + split[1] + '}';
        }

        config = {
            // DOC: escape(url),
            SWFFile: swf,
            ContentServiceUrl: bookmarks
        };

        // fp
        var supportedEvent = false;
        setTimeout(function () {
            // 定制书签的fp不支持事件
            if (!supportedEvent) {
                $viewer.addClass('loaded').removeClass('loading');
            }
        }, 800);
        $('#paper-viewer').bind('onDocumentLoadedError', function (e, errMessage) {
            $viewer.addClass('load-fail');
        }).bind('onDocumentLoading', function (e) {
            supportedEvent = true;
            // $viewer.removeClass('loaded').addClass('loading');
        }).bind('onPageLoading', function (e, page) {
            supportedEvent = true;
            // $viewer.removeClass('loaded').addClass('loading');
        }).bind('onDocumentLoaded', function (e, totalPages) {
            $viewer.addClass('loaded').removeClass('loading');
        }).bind('onPageLoaded', function (e, page) {
            $viewer.addClass('loaded').removeClass('loading');
        }).bind('onCurrentPageChanged', function (e, pagenum) {
            /*
             if (page_m && (pagenum < page_m * 1) && 10 <= pagenum) {
             $tips.show();
             } else {
             $tips.hide();
             }
             */
        }).bind('onExternalLinkClicked', function (e, link) {
            window.open(link, '_flexpaper_exturl');
        }).FlexPaperViewer({
            config: $.extend({
                // DOC: '',
                // SWFFile: '',
                ContentServiceUrl: '',      // 定制属性书签地址

                key: "$60d024ee0624fd2a5bb",
                Scale: 0.6,
                ZoomTransition: 'easeOut',
                ZoomTime: 0.5,
                ZoomInterval: 0.2,
                FitPageOnLoad: false,
                FitWidthOnLoad: true,
                ProgressiveLoading: false,
                FullScreenAsMaxWindow: false,
                MinZoomSize: 0.2,
                MaxZoomSize: 5,
                SearchMatchAll: false,
                InitViewMode: 'Portrait',
                RenderingOrder: 'flash',
                StartAtPage: '',
                ViewModeToolsVisible: true,
                ZoomToolsVisible: true,
                NavToolsVisible: true,
                CursorToolsVisible: true,
                SearchToolsVisible: true,

                WMode: 'opaque',
                JSONDataType : 'jsonp',
                jsDirectory: 'js/',
                cssDirectory: 'css/',
                localeDirectory: 'locale/',
                localeChain: 'zh_CN'
            }, config)
        });
    })(jQuery);
</script>
</body>
</html>
